<template>
	<view v-if="loading || error" class="loading_view">
		<u-loading mode="circle" v-if="loading" size="50"></u-loading>
		<u-toast ref="uToast" />
		<view class="messgae">{{ loading?'加载中...':'加载失败' }}</view>
	</view>
	<view v-else style="background-color: #EFEFEF;height: 100vh;overflow: auto;">
		<u-toast ref="uToast" />
		<view class="user_info">
			<view class="icon">
				<image  v-if="data.u_icon!=''" :src="data.u_icon"></image>
				<image v-else-if="data.u_sex==2" src=""></image>
				<image v-else src=""></image>
			</view>
			<view class="name">{{ data.u_nickname }}</view>
		</view>

		
		<view class="item_box">
			
			<view class="item_view">
				
				<view class="cen">
					
					<view class="left_item" v-if="data.tel!=''"><image src="../../static/info_icon/info_tel_s.png" class="icon"></image>手机认证</view>
					
					<view class="left_item" open-type="getPhoneNumber" @getphonenumber="decryptPhoneNumber" v-else><image src="../../static/info_icon/info_tel.png" class="icon"></image>手机认证</view>
					
					<view class="right_item">
						已认证
					</view>
				</view>
				
				<i class="exit_icon"></i>
			</view>
			
			<navigator url="/packageA/realName_prove/realName_prove" open-type="navigate">
			<view class="item_view">
				<view class="cen">
					<view class="left_item">
						<image v-if="data.idInfo && data.idInfo.u_status==1" src="../../static/info_icon/info_sm_s.png" class="icon"></image>
						<image v-else src="../../static/info_icon/info_sm.png" class="icon"></image>
						实名认证
					</view>
					
					<view class="right_item">
						<text v-if="!data.idInfo">前往认证</text>
						<text v-else-if="data.idInfo.u_status==-1">审核拒绝</text>
						<text v-else-if="data.idInfo.u_status==0">审核中</text>
						<text v-else>已认证</text>
					</view>
				</view>
				
				<i class="exit_icon"></i>
			</view>
			</navigator>
			
			<navigator url="/packageA/education_prove/education_prove" open-type="navigate">
			<view class="item_view">
				<view class="cen">
					<view class="left_item">
						<image src="../../static/info_icon/info_xl_s.png" v-if="data.education && data.education.u_status==1" class="icon"></image>
						<image v-else src="../../static/info_icon/info_xl.png" class="icon"></image>
						学历认证
					</view>
					
					<view class="right_item">
						<text v-if="!data.education">前往认证</text>
						<text v-else-if="data.education.u_status==-1">审核拒绝</text>
						<text v-else-if="data.education.u_status==0">审核中</text>
						<text v-else>已认证</text>
					</view>
				</view>
				
				<i class="exit_icon"></i>
			</view>
			</navigator>
			
			<navigator url="/pages/user/user" open-type="switchTab">
			<view class="item_view">
				<view class="cen">
					<view class="left_item">
						<image v-if="data.icon_prove && data.icon_prove.p_status==1" src="../../static/info_icon/info_user_s.png" class="icon"></image>
						<image v-else src="../../static/info_icon/info_user.png" class="icon"></image>
						头像认证
					</view>
					
					<view class="right_item">
						<text v-if="!data.icon_prove">前往认证</text>
						<text v-else-if="data.icon_prove.p_status==-1">审核拒绝</text>
						<text v-else-if="data.icon_prove.p_status==0">审核中</text>
						<text v-else>已认证</text>
					</view>
				</view>
				
				<i class="exit_icon"></i>
			</view>
			</navigator>
		</view>
		<!-- <button type="default" open-type="getPhoneNumber" @getphonenumber="decryptPhoneNumber">获取手机号</button> -->
	</view>
</template>

<script>
	export default {
		data(){	
			return {
				loading:false,
				data:{},
				error: false
			}
			
		},
		methods:{
			decryptPhoneNumber(e){
				console.log(e)
			},
			getPhone(e){
				console.log(e)
			},
			getData(){
				let that = this
				this.loading = true
				that.error = false
				this.$request({
					url:'/user/my_prove',
					method:'post',
					success(res){
						if(res.statusCode==200){
							if(res.data.code==1){
								that.data = res.data.data
							}else{
								that.$refs.uToast.show({
									title: res.data.msg,
									type: 'warning'
								})
								
								that.error = true
							}
						}else{
							that.$refs.uToast.show({
								title: '网络繁忙',
								type: 'warning'
							})
							that.error = true
						}
					},
					fail(){
						that.$refs.uToast.show({
							title: '获取失败',
							type: 'warning'
						})
						
						that.error = true
					},
					complete(){
						that.loading = false
					}
				})
			}
		},
		onLoad(){
			this.getData()
		}
	}
</script>

<style scoped>
	.loading_view{
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		color:#bbb;
		font-size: 32rpx;
		padding-top: 40vh;
	}
	.loading_view .messgae{
		margin-top: 20rpx;
	}
	.user_info{
		display: flex;
		flex-direction: column;
		align-items: center;
		padding: 20rpx 0;
		background-color: #fff;
	}
	.user_info .icon,.user_info .icon image{
		width:130rpx;
		height: 130rpx;
	}
	.user_info .icon{
		border-radius: 120rpx;
		overflow: hidden;
	}
	.user_info .name{
		font-size: 28rpx;
		margin-top: 20rpx;
	}
	.item_box{
		display: flex;
		flex-direction: column;
		margin-top: 30rpx;
		font-size: 26rpx;
	}
	.item_box:last-child{
		margin-bottom: 30rpx;
	}
	.item_box .item_view{
		width:750rpx;
		background-color: #FFFFFF;
		display: flex;
		justify-content: center;
		position: relative;
	}
	.item_box .item_view image.icon{
		width: 40rpx;
		height: 40rpx;
		/* margin-right: 20rpx;
		position: relative;
		top:6rpx; */
		position: absolute;
		left: 22rpx;
		top:28rpx;
	}
	.item_box .item_view .cen{
		width: 600rpx;
		height: 90rpx;
		border-bottom: 1px solid #EFEFEF;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	.item_box .item_view .cen .right_item{
		color: #888888;
	}
	.item_box .item_view .cen .left_item{
		text-indent: 20rpx;
	}
	.exit_icon{
		padding:10rpx;
		background: url('') no-repeat;
		background-size: 20rpx;
		position: absolute;
		top:35rpx;
		right: 24rpx;
	}
</style>